<template>
  <!-- 门禁-授权信息 -->
  <div class="door">
    <el-form :inline="true" :model="elform" class="demo-form-inline1" size="mini">
      <el-form-item label="区域">
        <el-select
          v-model="defaultArea"
          placeholder="请选择"
          size="mini"
          clearable
          style="width: 140px"
          @change="selectArea"
        >
          <el-option label="全部区域" value></el-option>
          <el-option
            v-for="item in areaInfoList"
            :key="item.areaGuid"
            :label="item.areaName"
            :value="item.areaGuid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="楼栋">
        <el-select
          v-model="defaultBuilding"
          placeholder="请选择"
          size="mini"
          clearable
          style="width: 100px"
        >
          <el-option label="全部楼栋" value></el-option>
          <el-option
            v-for="item in buildingInfoList"
            :key="item.buildingGuid"
            :label="item.buildingName"
            :value="item.buildingGuid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="房间">
        <el-input v-model="roomName" placeholder="名称" size="mini" clearable style="width: 110px"></el-input>
      </el-form-item>
      <el-form-item label="所属角色" prop="roleGuid">
        <el-select v-model="roleGuid" placeholder="请选择角色" size="mini" clearable style="width:150px">
          <el-option
            v-for="item in roleInfo"
            :key="item.roleGuid"
            :label="item.roleName"
            :value="item.roleGuid"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="姓名/编号/卡号">
        <el-input v-model="userName" placeholder="姓名" size="mini" clearable style="width: 110px"></el-input>
      </el-form-item>
      <el-form-item label="下载到设备的状态">
        <el-select
          v-model="downloadStateType"
          placeholder="下载到设备的状态 "
          size="mini"
          style="width: 150px"
          clearable
        >
          <el-option
            v-for="item in downloadStateTypeOption"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="同步状态">
        <el-select
          v-model="syncState"
          placeholder="同步状态 "
          size="mini"
          style="width: 120px"
          clearable
        >
          <el-option
            v-for="item in syncStateOption"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item class="searchmarigin">
        <el-button type="primary" @click="onSubmit" size="mini" icon="el-icon-search">查询</el-button>
        <!-- <el-button
          type="danger"
          @click="onDelete"
          size="mini"
          icon="el-icon-delete"
          v-if="isauth('access_auth_edit')"
        >取消授权</el-button>
        <el-button type="primary" @click="onKeep" size="mini" v-if="isauth('access_auth_edit')">保存修改</el-button>-->
        <el-button type="primary" @click="reissue" size="mini" icon="el-icon-document-copy">重新下发名单</el-button>
        <el-button type="primary" @click="onExport" size="mini" icon="el-icon-document-copy">导出</el-button>
      </el-form-item>
    </el-form>

    <el-tabs type="border-card" v-model="activeName">
      <el-tab-pane label="双门控制器" name="thirdone">
        <el-form
          :inline="true"
          :model="elformTwo"
          size="mini"
          class="demo-form-inline"
          ref="elformTwo"
          v-show="activeName == 'thirdone'"
        >
          <!-- <el-form-item label="开始时间" prop="startTime">
        <el-date-picker
          v-model="elformTwo.startTime"
          type="datetime"
          placeholder="选择日期时间"
          value-format="yyyy-MM-dd HH:mm:ss"
          style="width:180px"
          size="mini"
        ></el-date-picker>
          </el-form-item>-->
          <el-form-item label="结束时间" prop="endTime">
            <!-- <span class="time">至</span> -->
            <el-date-picker
              v-model="elformTwo.endTime"
              type="datetime"
              placeholder="选择日期时间"
              value-format="yyyy-MM-dd HH:mm:ss"
              :default-time="'23:59:59'"
              size="mini"
              style="width:180px"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label=" " prop="backLock">
            <el-checkbox v-model="elformTwo.backLock">反锁开门</el-checkbox>
          </el-form-item>
          <!-- <span>星期</span> -->
          <el-form-item label="星期">
            <el-form-item label prop="monday">
              <el-checkbox v-model="elformTwo.monday">一</el-checkbox>
            </el-form-item>
            <el-form-item label prop="tuesday">
              <el-checkbox v-model="elformTwo.tuesday">二</el-checkbox>
            </el-form-item>
            <el-form-item label prop="wednesday">
              <el-checkbox v-model="elformTwo.wednesday">三</el-checkbox>
            </el-form-item>
            <el-form-item label prop="thursday">
              <el-checkbox v-model="elformTwo.thursday">四</el-checkbox>
            </el-form-item>
            <el-form-item label prop="friday">
              <el-checkbox v-model="elformTwo.friday">五</el-checkbox>
            </el-form-item>
            <el-form-item label prop="saturday">
              <el-checkbox v-model="elformTwo.saturday">六</el-checkbox>
            </el-form-item>
            <el-form-item label prop="sunday">
              <el-checkbox v-model="elformTwo.sunday">日</el-checkbox>
            </el-form-item>
          </el-form-item>
          <el-form-item label="星期时段">
            <el-form-item label="一" prop="mondayTimeStageIndex">
              <el-select
                v-model="elformTwo.mondayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="二" prop="tuesdayTimeStageIndex">
              <el-select
                v-model="elformTwo.tuesdayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="三" prop="wednesdayTimeStageIndex">
              <el-select
                v-model="elformTwo.wednesdayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>

            <el-form-item label="四" prop="thursdayTimeStageIndex">
              <el-select
                v-model="elformTwo.thursdayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="五" prop="fridayTimeStageIndex">
              <el-select
                v-model="elformTwo.fridayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="六" prop="saturdayTimeStageIndex">
              <el-select
                v-model="elformTwo.saturdayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="日" prop="sundayTimeStageIndex">
              <el-select
                v-model="elformTwo.sundayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="假日时段" prop="holidayTimeStageIndex">
              <el-select
                v-model="elformTwo.holidayTimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
          </el-form-item>
          <el-form-item label prop="door1">
            <el-checkbox v-model="elformTwo.door1">门1</el-checkbox>
          </el-form-item>
          <el-form-item label prop="door2">
            <el-checkbox v-model="elformTwo.door2">门2</el-checkbox>
          </el-form-item>
          <el-form-item label="开门密码" prop="doorPassword">
            <el-input
              placeholder="请输入密码"
              v-model="elformTwo.doorPassword"
              size="mini"
              style="width:100px"
            ></el-input>
          </el-form-item>
          <el-form-item>
            <el-button
              type="primary"
              @click="resetFilter('elformTwo')"
              size="mini"
              icon="el-icon-refresh"
            >重置条件</el-button>
            <el-button type="primary" @click="editTwoEquipment" size="mini">批量改动选中的授权</el-button>
            <el-button
              type="success"
              @click="onKeep"
              size="mini"
              v-if="isauth('access_auth_edit')"
            >保存修改</el-button>
            <!-- icon="el-icon-delete" -->
            <el-button
              type="danger"
              @click="onDelete"
              size="mini"
              v-if="isauth('access_auth_edit')"
            >取消授权</el-button>
            <!-- <el-button type="primary" @click="onExport" size="mini" icon="el-icon-document-copy">导出</el-button> -->
          </el-form-item>
        </el-form>
        <div class="my_table">
          <el-table
            v-loading="loading"
            :data="detailslist"
            ref="twoTable"
            border
            highlight-current-row
            :header-cell-style="(header) => headFirst(header, 2)"
            @selection-change="equipmentChange"
            style="width: 100%"
            height="calc(100vh - 390px)"
            :cell-style="(res) => headFirst_col(res, [],2)"
          >
            <!-- <el-table-column
              type="selection"
              width="40"
              align="center"
              v-if="isauth('access_auth_edit')"
            ></el-table-column>-->
            <el-table-column label="是否选中" prop="isCheck" align="center" width="35">
              <template slot="header" slot-scope="scope">
                <el-checkbox :value="isTwoAll" @change="CheckTwoAll" />
              </template>
              <template slot-scope="scope">
                <el-checkbox
                  :value="scope.row.isCheck"
                  @change="(isCheck) => CheckTwoSelect(isCheck, scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                />
              </template>
            </el-table-column>
            <el-table-column prop="userName" label="姓名" align="center"></el-table-column>
            <el-table-column prop="departmentName" label="部门" align="center" min-width="110px"></el-table-column>
            <el-table-column prop="cardNumber" label="卡号" align="center" min-width="100px"></el-table-column>
            <el-table-column prop="terminalCode" label="设备编号" align="center" min-width="100px"></el-table-column>
            <!-- 有效时间 -->
            <el-table-column prop="startTime" label="开始时间" align="center" width="190px">
              <template slot-scope="scope">
                <el-date-picker
                  v-model="scope.row.startTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  size="mini"
                  style="width: 180px"
                  @change="handleTwoSelect(scope.row)"
                  disabled
                ></el-date-picker>
              </template>
            </el-table-column>
            <!-- 有效时间 -->
            <el-table-column prop="endTime" label="结束时间" align="center" width="190px">
              <template slot-scope="scope">
                <el-date-picker
                  v-model="scope.row.endTime"
                  type="datetime"
                  placeholder="选择日期时间"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  size="mini"
                  style="width: 180px"
                  @change="handleTwoSelect(scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                ></el-date-picker>
              </template>
            </el-table-column>
            <el-table-column prop="backLock" label="反锁开门" align="center" width="35px">
              <template slot-scope="scope">
                <el-checkbox
                  v-model="scope.row.backLock"
                  @change="handleTwoChange(scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                ></el-checkbox>
              </template>
            </el-table-column>
            <!-- 开门-礼拜 -->
            <el-table-column prop="Sunday" label="星期" align="center">
              <el-table-column prop="monday" label="一" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.monday"
                    style="padding: 0"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="tuesday" label="二" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.tuesday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="wednesday" label="三" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.wednesday"
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="thursday" label="四" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.thursday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="friday" label="五" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.friday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="saturday" label="六" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.saturday"
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="sunday" label="日" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                    @change="handleTwoChange(scope.row)"
                    v-model="scope.row.sunday"
                  ></el-checkbox>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 星期时段 -->
            <el-table-column prop="SundayTime" label="星期时段" align="center">
              <el-table-column prop="mondayTimeStageIndex" label="一" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.mondayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="tuesdayTimeStageIndex" label="二" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.tuesdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>

              <el-table-column prop="wednesdayTimeStageIndex" label="三" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.wednesdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>

              <el-table-column prop="thursdayTimeStageIndex" label="四" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.thursdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="fridayTimeStageIndex" label="五" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.fridayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="saturdayTimeStageIndex" label="六" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.saturdayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column prop="sundayTimeStageIndex" label="日" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.sundayTimeStageIndex"
                    placeholder="请选择"
                    @change="handleTwoSelect(scope.row)"
                    size="mini"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 假日时段 -->
            <el-table-column prop="holidayTimeStageIndex" label="假日时段" align="center" width="75px">
              <template slot-scope="scope">
                <el-select
                  v-model="scope.row.holidayTimeStageIndex"
                  placeholder="请选择"
                  @change="handleTwoSelect(scope.row)"
                  size="mini"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                >
                  <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                </el-select>
              </template>
            </el-table-column>
            <!-- 门1 -->
            <el-table-column prop="door1" label="门1" align="center" width="45px">
              <template slot-scope="scope">
                <el-checkbox
                  v-model="scope.row.door1"
                  @change="handleTwoChange(scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                ></el-checkbox>
              </template>
            </el-table-column>
            <!-- 门2 -->
            <el-table-column prop="door2" label="门2" align="center" width="45px">
              <template slot-scope="scope">
                <el-checkbox
                  v-model="scope.row.door2"
                  @change="handleTwoChange(scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                ></el-checkbox>
              </template>
            </el-table-column>

            <!-- 开门密码 -->
            <el-table-column prop="doorPassword" label="开门密码" align="center">
              <template slot-scope="scope">
                <el-input
                  v-model="scope.row.doorPassword"
                  size="mini"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="updateFlag" label="状态" align="center" min-width="110px">
              <template slot-scope="scope">
                {{ scope.row.updateFlag | updateFlagType }},{{
                scope.row.downloadState | downloadStateType
                }}
              </template>
            </el-table-column>
            <el-table-column prop="syncState" label="同步状态" align="center" min-width="110px">
              <template slot-scope="scope">{{ scope.row.syncState == 1 ? '已同步':'未同步' }}</template>
            </el-table-column>
          </el-table>
        </div>
        <div class="page">
          <el-pagination
            @size-change="deviceSizeChange"
            @current-change="deviceCurrentChangepage"
            :current-page="deviceCurrentPage"
            :page-sizes="[5, 10, 20, 30]"
            :page-size="devicePageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="devicerecordCount"
          ></el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="四门控制器" name="thirdtwo">
        <el-form
          :inline="true"
          :model="elformFour"
          size="mini"
          class="demo-form-inline"
          ref="elformFour"
          v-show="activeName == 'thirdtwo'"
        >
          <el-form-item label="星期">
            <el-form-item label prop="monday">
              <el-checkbox v-model="elformFour.monday">一</el-checkbox>
            </el-form-item>
            <el-form-item label prop="tuesday">
              <el-checkbox v-model="elformFour.tuesday">二</el-checkbox>
            </el-form-item>
            <el-form-item label prop="wednesday">
              <el-checkbox v-model="elformFour.wednesday">三</el-checkbox>
            </el-form-item>
            <el-form-item label prop="thursday">
              <el-checkbox v-model="elformFour.thursday">四</el-checkbox>
            </el-form-item>
            <el-form-item label prop="friday">
              <el-checkbox v-model="elformFour.friday">五</el-checkbox>
            </el-form-item>
            <el-form-item label prop="saturday">
              <el-checkbox v-model="elformFour.saturday">六</el-checkbox>
            </el-form-item>
            <el-form-item label prop="sunday">
              <el-checkbox v-model="elformFour.sunday">日</el-checkbox>
            </el-form-item>
          </el-form-item>
          <el-form-item label="门1:">
            <el-form-item label prop="door1">
              <el-checkbox v-model="elformFour.door1">是否启用</el-checkbox>
            </el-form-item>
            <el-form-item label="时段" prop="door1TimeStageIndex">
              <el-select
                v-model="elformFour.door1TimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
          </el-form-item>
          <el-form-item label="门2:">
            <el-form-item label prop="door2">
              <el-checkbox v-model="elformFour.door2">是否启用</el-checkbox>
            </el-form-item>
            <el-form-item label="时段" prop="door2TimeStageIndex">
              <el-select
                v-model="elformFour.door2TimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
          </el-form-item>
          <el-form-item label="门3:">
            <el-form-item label prop="door3">
              <el-checkbox v-model="elformFour.door3">是否启用</el-checkbox>
            </el-form-item>
            <el-form-item label="时段" prop="door3TimeStageIndex">
              <el-select
                v-model="elformFour.door3TimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
          </el-form-item>
          <el-form-item label="门4:">
            <el-form-item label prop="door4">
              <el-checkbox v-model="elformFour.door4">是否启用</el-checkbox>
            </el-form-item>
            <el-form-item label="时段" prop="door4TimeStageIndex">
              <el-select
                v-model="elformFour.door4TimeStageIndex"
                placeholder="请选择"
                style="width:75px"
                size="mini"
              >
                <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
              </el-select>
            </el-form-item>
          </el-form-item>

          <el-form-item>
            <el-button
              type="primary"
              @click="resetFilter('elformFour')"
              size="mini"
              icon="el-icon-refresh"
            >重置条件</el-button>
            <el-button type="primary" @click="editFourEquipment" size="mini">批量改动选中的授权</el-button>
            <el-button
              type="success"
              @click="onKeep"
              size="mini"
              v-if="isauth('access_auth_edit')"
            >保存修改</el-button>
            <!-- icon="el-icon-delete" -->
            <el-button
              type="danger"
              @click="onDelete"
              size="mini"
              v-if="isauth('access_auth_edit')"
            >取消授权</el-button>
            <!-- <el-button type="primary" @click="onExport" size="mini" >导出</el-button> -->
          </el-form-item>
        </el-form>
        <div class="my_table">
          <el-table
            v-loading="loading"
            :data="fourDoorList"
            ref="fourTable"
            border
            highlight-current-row
            :header-cell-style="(header) => headFirst(header, 2)"
            @selection-change="fourChange"
            style="width: 100%"
            height="calc(100vh - 370px)"
            :cell-style="(res) => headFirst_col(res, [],2)"
          >
            <!-- <el-table-column
              type="selection"
              width="45"
              align="center"
              v-if="isauth('access_auth_edit')"
            ></el-table-column>-->
            <el-table-column label="是否选中" prop="isCheck" align="center" width="45">
              <template slot="header" slot-scope="scope">
                <el-checkbox :value="isFourAll" @change="CheckFourAll" />
              </template>
              <template slot-scope="scope">
                <el-checkbox
                  :value="scope.row.isCheck"
                  @change="(isCheck) => CheckFourSelect(isCheck, scope.row)"
                  :disabled="
                    scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                  "
                />
              </template>
            </el-table-column>
            <el-table-column prop="userName" label="姓名" align="center"></el-table-column>
            <el-table-column prop="departmentName" label="部门" align="center" min-width="120px"></el-table-column>
            <el-table-column prop="cardNumber" label="卡号" align="center" min-width="100px"></el-table-column>
            <el-table-column prop="terminalCode" label="设备编号" align="center" min-width="100px"></el-table-column>
            <!-- 开门-礼拜 -->
            <el-table-column prop="Sunday" label="星期" align="center">
              <el-table-column prop="monday" label="一" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.monday"
                    style="padding: 0"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="tuesday" label="二" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.tuesday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="wednesday" label="三" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.wednesday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="thursday" label="四" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.thursday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="friday" label="五" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.friday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="saturday" label="六" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.saturday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>

              <el-table-column prop="sunday" label="日" align="center" width="35px">
                <template slot-scope="scope">
                  <el-checkbox
                    @change="handleFourChange(scope.row)"
                    v-model="scope.row.sunday"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门1 -->
            <el-table-column prop="door1" label="门1" align="center" width="45px">
              <el-table-column prop="door1" label="是否启用" align="center" width="60px">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.door1"
                    @change="handleFourChange(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door1TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door1TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门2 -->
            <el-table-column prop="door2" label="门2" align="center" width="45px">
              <el-table-column prop="door2" label="是否启用" align="center" width="60px">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.door2"
                    @change="handleFourChange(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door2TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door2TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门3 -->
            <el-table-column prop="door3" label="门3" align="center" width="45px">
              <el-table-column prop="door3" label="是否启用" align="center" width="60px">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.door3"
                    @change="handleFourChange(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door3TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door3TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <!-- 门4 -->
            <el-table-column prop="door4" label="门4" align="center" width="45px">
              <el-table-column prop="door4" label="是否启用" align="center" width="60px">
                <template slot-scope="scope">
                  <el-checkbox
                    v-model="scope.row.door4"
                    @change="handleFourChange(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  ></el-checkbox>
                </template>
              </el-table-column>
              <el-table-column prop="door4TimeStageIndex" label="时段" align="center" width="75px">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.door4TimeStageIndex"
                    placeholder="请选择"
                    size="mini"
                    @change="handleFourSelect(scope.row)"
                    :disabled="
                      scope.row.updateFlag == 3 || !isauth('access_auth_edit')
                    "
                  >
                    <el-option v-for="item in 16" :key="item-1" :label="item-1" :value="item-1"></el-option>
                  </el-select>
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column prop="updateFlag" label="状态" align="center" min-width="110px">
              <template slot-scope="scope">
                {{ scope.row.updateFlag | updateFlagType }},{{
                scope.row.downloadState | downloadStateType
                }}
              </template>
            </el-table-column>
             <el-table-column prop="syncState" label="同步状态" align="center" min-width="110px">
                <template slot-scope="scope">
                {{ scope.row.syncState == 1 ? '已同步':'未同步' }}
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="page">
          <el-pagination
            @size-change="fourSizeChange"
            @current-change="fourCurrentChangepage"
            :current-page="fourCurrentPage"
            :page-sizes="[5, 10, 20, 30]"
            :page-size="fourPageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="fourrecordCount"
          ></el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
    <div class="page" style="margin-top: 20px"></div>
  </div>
</template>
<script>
import bus from '@/bus.js'
export default {
  data() {
    return {
      activeName: 'thirdone',
      // 导出表格名称
      filename: '门禁-双门授权信息',
      elform: {},
      // 默认选择的quyu
      defaultArea: '',
      // 区域列表
      areaInfoList: [],
      // 楼栋默认
      defaultBuilding: '',
      // 楼栋列表
      buildingInfoList: [],
      // 房间号信息
      roomName: '',
      // 姓名/编号/卡号信息
      userName: '',
      // 角色
      roleInfo: [],
      roleGuid: '',

      // 下载状态
      downloadStateType: '',
      downloadStateTypeOption: [
        { value: 0, label: '未下载' },
        { value: 1, label: '下载成功' },
        { value: 2, label: '下载失败' }
      ],
      syncState: '',
      syncStateOption: [
        { value: 0, label: '未同步' },
        { value: 1, label: '已同步' }
      ],
      loading: false,
      /**
       * 双门
       */
      // 改变选中
      elformTwo: {
        sunday: false,
        monday: false,
        tuesday: false,
        wednesday: false,
        thursday: false,
        friday: false,
        saturday: false,
        backLock: false,
        sundayTimeStageIndex: 0,
        mondayTimeStageIndex: 0,
        tuesdayTimeStageIndex: 0,
        wednesdayTimeStageIndex: 0,
        thursdayTimeStageIndex: 0,
        fridayTimeStageIndex: 0,
        saturdayTimeStageIndex: 0,
        holidayTimeStageIndex: 0,
        exceptionTimeStageIndex: 0,
        // startTime: this.getNowTime('yy-mm-dd 00'),
        endTime: this.getNowTime('yy-mm-dd 59'),
        doorPassword: '',
        door1: true,
        door2: false
      },
      isTwoAll: false,
      //双门所有设备
      detailslistAll: [],
      // 双门信息
      detailslist: [],
      // 被选中的双门设备
      towDoorChangeList: [],
      // 双门设备分页
      devicepageNum: 1,
      deviceCurrentPage: 1,
      devicePageSize: 20,
      devicerecordCount: 0,
      /**
       * 四门
       * */
      /**
       * 四门
       */
      elformFour: {
        sunday: false,
        monday: false,
        tuesday: false,
        wednesday: false,
        thursday: false,
        friday: false,
        saturday: false,
        door1TimeStageIndex: 0,
        door2TimeStageIndex: 0,
        door3TimeStageIndex: 0,
        door4TimeStageIndex: 0,
        door1: true,
        door2: false,
        door3: false,
        door4: false
      },
      isFourAll: false,
      // 四门所有设备信息
      fourDoorListAll: [],
      // 四门设备信息
      fourDoorList: [],
      // 被选中的四门设备
      fourDoorChangeList: [],
      // 默认四门设备列表
      fourDefaultDevice: [],
      // 4门设备分页
      fourpageNum: 1,
      fourCurrentPage: 1,
      fourPageSize: 20,
      fourrecordCount: 0
    }
  },
  computed: {
    changeschoolid: {
      get() {
        return this.$store.state.user.changeschoolid
      }
    }
  },
  created() {
    this.userGuid = sessionStorage.getItem('administrator')
    // 区域列表
    this.getAreaInfo()
  },
  filters: {
    handleEmpowerType(empower) {
      if (empower == 0) {
        return '未授权'
      }
      if (empower == 1) {
        return '指定房间'
      }
      if (empower == 2) {
        return '临时授权'
      }
      if (empower == 2) {
        return '导入授权'
      }
    },
    updateFlagType(val) {
      val = Number(val)
      switch (val) {
        case 1:
          return '新增'
          break
        case 2:
          return '覆盖'
          break
        case 3:
          return '删除'
          break
      }
    },
    downloadStateType(val) {
      val = Number(val)
      switch (val) {
        case 0:
          return '未下载'
          break
        case 1:
          return '下载成功'
          break
        case 2:
          return '设备名单已满'
          break
        case 5:
          return '名单内容有误'
          break
        case 6:
          return '找不到对应的设备'
          break
        case 7:
          return '名单已过期'
          break
      }
    }
  },
  mounted() {
    this.getroleInfo()
  },
  methods: {
    // 重置条件
    resetFilter(formName) {
      this.$refs[formName].resetFields()
    },
    // 角色查询
    getroleInfo() {
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-role-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          console.log(data.messageContent)
          this.roleInfo = data.messageContent
          // if (this.roleInfo.length != 0) {
          //   this.$set(this.ruleForm, "roleGuid", this.roleInfo[0].roleGuid);
          // }
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 授权状态转换
    updateFlagTypeFunction(val) {
      val = Number(val)
      switch (val) {
        case 1:
          return '新增'
          break
        case 2:
          return '覆盖'
          break
        case 3:
          return '删除'
          break
      }
    },
    // 区域查询
    getAreaInfo() {
      this.$http({
        url: this.$http.adornUrl('/area/room/area-info-search'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            unitGuid: this.changeschoolid,
            userGuid: this.userGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.areaInfoList = data.messageContent
          console.log(data.messageContent)
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 选择区域后触发
    selectArea() {
      console.log(this.defaultArea)
      this.defaultBuilding = ''
      // 获取对应区域内的楼栋信息
      this.$http({
        url: this.$http.adornUrl('/area/room/get-area-building'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            areaGuid: this.defaultArea
          },
          messageType: 0
        })
      }).then(({ data }) => {
        if (data.messageCode == 200) {
          this.buildingInfoList = data.messageContent
          console.log(data.messageContent)
        } else {
          this.$message.error(data.errorMessage)
        }
      })
      // this.getAreaInfo();
    },
    // 查询
    onSubmit() {
      let searchInfo = {}
      // 区域限定
      searchInfo.areaGuid = this.defaultArea
      // 楼栋限定
      searchInfo.buildingGuid = this.defaultBuilding
      // 姓名/编号/卡号  规则
      searchInfo.userData = this.userName
      // 房间限定
      searchInfo.roomName = this.roomName
      searchInfo.downloadState = this.downloadStateType
      searchInfo.syncState = this.syncState
      searchInfo.roleGuid = this.roleGuid
      searchInfo.unitGuid = this.changeschoolid
      this.searchInfo = searchInfo
      if (this.activeName == 'thirdone') {
        this.devicepageNum = 1
        this.getEquipment()
      } else if (this.activeName == 'thirdtwo') {
        this.loading = true
        this.fourpageNum = 1
        this.getFour()
      }
    },
    // 双门查询
    getEquipment() {
      this.loading = true
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-two-door-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            ...this.searchInfo
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loading = false
        if (data.messageCode == 200) {
          let roomList1 = JSON.parse(JSON.stringify(data.messageContent || []))
          roomList1.map((item, index) => {
            // 星期
            item.monday = item.monday == 1 ? true : false
            item.tuesday = item.tuesday == 1 ? true : false
            item.wednesday = item.wednesday == 1 ? true : false
            item.thursday = item.thursday == 1 ? true : false
            item.friday = item.friday == 1 ? true : false
            item.saturday = item.saturday == 1 ? true : false
            item.sunday = item.sunday == 1 ? true : false
            // 反锁
            item.backLock = item.backLock == 1 ? true : false
            if (item.updateFlag != 3) {
              item.isCheck = this.isTwoAll
            } else {
              item.isCheck = false
            }
            item.id = index
          })
          this.detailslistAll = roomList1
          this.getTwoList(this.devicepageNum, this.devicePageSize)
          this.devicerecordCount = roomList1.length
          this.defaultDevice = JSON.parse(JSON.stringify(roomList1))
          // // 总条数
          // this.devicerecordCount = data.messageContent.recordCount
          // this.deviceCurrentPage = data.messageContent.pageNum
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 双门设备选择
    equipmentChange(val) {
      console.log(val)
      this.towDoorChangeList = val
    },
    /**
     * 双门自己分页
     */
    getTwoList(pagenum, pagesize) {
      this.detailslist = this.detailslistAll.slice(
        (pagenum - 1) * pagesize,
        pagenum * pagesize
      )
    },
    // 选中数据
    CheckTwoSelect(val, row) {
      console.log(val, row)
      // 因为是用索引当做id的。
      this.detailslistAll[row.id].isCheck = val
      console.log(this.detailslistAll)
    },
    // 全选按钮
    CheckTwoAll(val) {
      this.isTwoAll = val
      this.detailslistAll.map(item => {
        if (item.updateFlag != 3) {
          item.isCheck = val
        }
      })
      console.log(this.detailslistAll)
    },
    // 前端分页 双门设备
    deviceSizeChange(val) {
      console.log(val)
      this.devicePageSize = val
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    deviceCurrentChangepage(val) {
      this.devicepageNum = val
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    // 双门设备选择
    equipmentChange(val) {
      let arr = []
      this.detailslistAll.map(item => {
        if (item.isCheck) {
          console.log(item)
          arr.push(item)
        }
      })
      this.towDoorChangeList = arr
    },
    // 修改选中的双门控制器
    editTwoEquipment() {
      this.detailslistAll.map((item, index) => {
        if (item.isCheck) {
          let old = item
          this.detailslistAll[index] = { ...old, ...this.elformTwo }
        }
      })
      this.getTwoList(this.devicepageNum, this.devicePageSize)
    },
    // 双门时间选中后触发
    handleTwoSelect(row) {
      this.detailslistAll[row.id].isCheck = true
      console.log(this.detailslistAll)
    },
    // 双门多选框是否选中
    handleTwoChange(row) {
      this.detailslistAll[row.id].isCheck = true
    },
    /**
     * 四门
     */
    // 修改选中的四门控制器
    editFourEquipment() {
      this.fourDoorListAll.map((item, index) => {
        if (item.isCheck) {
          let old = item
          this.fourDoorListAll[index] = { ...old, ...this.elformFour }
          console.log(item)
        }
      })
      console.log(this.fourDoorListAll)
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },
    // 四门查询
    getFour() {
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-four-door-search-list'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            ...this.searchInfo
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loading = false
        if (data.messageCode == 200) {
          let roomList1 = JSON.parse(JSON.stringify(data.messageContent || []))
          roomList1.map((item, index) => {
            // 星期
            item.monday = item.monday == 1 ? true : false
            item.tuesday = item.tuesday == 1 ? true : false
            item.wednesday = item.wednesday == 1 ? true : false
            item.thursday = item.thursday == 1 ? true : false
            item.friday = item.friday == 1 ? true : false
            item.saturday = item.saturday == 1 ? true : false
            item.sunday = item.sunday == 1 ? true : false
            // 反锁
            item.backLock = item.backLock == 1 ? true : false
            if (item.updateFlag != 3) {
              item.isCheck = this.isFourAll
            } else {
              item.isCheck = false
            }
            item.id = index
          })

          this.fourDoorListAll = roomList1
          this.getFourList(this.fourpageNum, this.fourPageSize)
          this.fourrecordCount = roomList1.length
          this.fourDefaultDevice = JSON.parse(JSON.stringify(roomList1))
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },

    // 四门时间选中后触发
    handleFourSelect(row) {
      this.fourDoorListAll[row.id].isCheck = true
    },
    // 四门多选框是否选中
    handleFourChange(row) {
      this.fourDoorListAll[row.id].isCheck = true
    },
    // 四门设备选择
    fourChange(val) {
      let arr = []
      this.fourDoorListAll.map(item => {
        if (item.isCheck) {
          console.log(item)
          arr.push(item)
        }
      })
      this.fourDoorChangeList = arr
    },
    /**
     * 自己分页
     */
    getFourList(pagenum, pagesize) {
      this.fourDoorList = this.fourDoorListAll.slice(
        (pagenum - 1) * pagesize,
        pagenum * pagesize
      )
    },
    // 选中数据
    CheckFourSelect(val, row) {
      // 因为是用索引当做id的。
      this.fourDoorListAll[row.id].isCheck = val
      console.log(this.fourDoorListAll)
    },
    // 全选按钮
    CheckFourAll(val) {
      this.isFourAll = val
      this.fourDoorListAll.map(item => {
        if (item.updateFlag != 3) {
          item.isCheck = val
        }
      })
    },
    // 四门设备分页函数
    fourSizeChange(val) {
      this.fourPageSize = val
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },
    fourCurrentChangepage(val) {
      this.fourpageNum = val
      this.getFourList(this.fourpageNum, this.fourPageSize)
    },
    // 将数据转为0，1
    getRoomList(arr) {
      if (arr.length == 0) {
        return []
      }
      let arr1 = JSON.parse(JSON.stringify(arr))
      arr1.map(item => {
        item.unitGuid = this.changeschoolid
        // 反锁
        item.backLock = item.backLock ? 1 : 0
        item.monday = item.monday ? 1 : 0
        item.tuesday = item.tuesday ? 1 : 0
        item.wednesday = item.wednesday ? 1 : 0
        item.thursday = item.thursday ? 1 : 0
        item.friday = item.friday ? 1 : 0
        item.saturday = item.saturday ? 1 : 0
        item.sunday = item.sunday ? 1 : 0
      })
      console.log(arr1)
      return arr1
    },
    // 保存
    onKeep() {
      // 双门
      if (this.activeName === 'thirdone') {
        // 获取选中数据
        this.equipmentChange()
        if (this.towDoorChangeList.length == 0) {
          this.$message({
            message: '请选择双门设备',
            type: 'warning'
          })
          return false
        }
        let newArr = this.getRoomList(
          JSON.parse(JSON.stringify(this.towDoorChangeList))
        )
        this.editTwoDoor(newArr)
        this.towDoorChangeList = []
        // 初始化
        this.detailslistAll = JSON.parse(JSON.stringify(this.defaultDevice))
        this.getTwoList(this.devicepageNum, this.devicePageSize)
      } else if (this.activeName === 'thirdtwo') {
        // 获取选中数据
        this.fourChange()
        // 四门
        if (this.fourDoorChangeList.length == 0) {
          this.$message({
            message: '请选择四门设备',
            type: 'warning'
          })
          return false
        }
        // 四门选中数据
        let newArr = this.getRoomList(
          JSON.parse(JSON.stringify(this.fourDoorChangeList))
        )
        this.editFourDoor(newArr)
        this.fourDoorChangeList = []
        this.fourDoorList = JSON.parse(JSON.stringify(this.fourDefaultDevice))
      }
    },
    // 双门保存
    editTwoDoor(newArr) {
      // 批量加载条
      this.loadingZ = this.Loading.service({
        lock: true,
        text: '正在修改授权中,请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      console.log(newArr)
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-two-door-update'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: newArr,
          messageType: 0
        })
      }).then(({ data }) => {
        this.loadingZ.close()
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '双门修改成功'
          })
          this.onSubmit()
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 四门保存
    editFourDoor(newArr) {
      // 批量加载条
      this.loadingZ = this.Loading.service({
        lock: true,
        text: '正在修改授权中,请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-four-door-update'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: newArr,
          messageType: 0
        })
      }).then(({ data }) => {
        this.loadingZ.close()
        if (data.messageCode == 200) {
          this.$message({
            type: 'success',
            message: '四门修改成功'
          })
          this.onSubmit()
        } else {
          this.$message.error(data.errorMessage)
        }
      })
    },
    // 导出数据需要用到的
    formatJson(filterVal, jsonData) {
      return jsonData.map(v =>
        filterVal.map(j => {
          if (j === 'timestamp') {
            return parseTime(v[j])
          } else {
            return v[j]
          }
        })
      )
    },
    // 导出
    onExport() {
      let searchInfo = {}
      // 区域限定
      if (this.defaultArea != '') {
        searchInfo.areaGuid = this.defaultArea
      }
      // 楼栋限定
      if (this.defaultBuilding != '') {
        searchInfo.buildingGuid = this.defaultBuilding
      }
      // 姓名/编号/卡号  规则
      if (this.userName != '') {
        searchInfo.userData = this.userName
      }
      // 房间限定
      if (this.roomName != '') {
        searchInfo.roomName = this.roomName
      }
      searchInfo.unitGuid = this.changeschoolid
      // 双门导出
      if (this.activeName == 'thirdone') {
        this.filename = '门禁-双门授权信息'
        if (this.devicerecordCount == 0) {
          this.$message({
            message: '无数据可导出',
            type: 'warning'
          })
          return false
        }
        this.$http({
          url: this.$http.adornUrl(
            '/terminal/entrance/entrance-name-two-door-search-page'
          ),
          method: 'post',
          data: this.$http.adornData({
            messageContent: {
              asc: true,
              pageNum: 1,
              pageSize: this.devicerecordCount,
              searchInfo: searchInfo
            },
            messageType: 0
          })
        }).then(({ data }) => {
          if (data.messageCode == 200) {
            // 导出数据
            let detailslist = data.messageContent.data
            detailslist.map(item => {
              item.updateFlag = this.updateFlagTypeFunction(item.updateFlag)
              item.door1 = item.door1 ? 1 : 0
              item.door2 = item.door2 ? 1 : 0
            })
            require.ensure([], () => {
              let multiHeader = [
                [
                  '姓名',
                  '部门',
                  '卡号',
                  '设备编号',
                  '开始时间',
                  '结束时间',
                  '反锁开门',
                  '星期',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '星期时段',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '假日时段',
                  '门1',
                  '门2',
                  '开门密码',
                  '授权状态'
                ]
              ]
              let merges = [
                'A1:A2',
                'B1:B2',
                'C1:C2',
                'D1:D2',
                'E1:E2',
                'F1:F2',
                'G1:G2',
                'H1:N1',
                'O1:U1',
                'V1:V2',
                'W1:W2',
                'X1:X2',
                'Y1:Y2',
                'Z1:Z2'
              ]
              let tHeader = [
                '姓名',
                '部门',
                '卡号',
                '设备编号',
                '开始时间',
                '结束时间',
                '反锁开门',
                '一',
                '二',
                '三',
                '四',
                '五',
                '六',
                '日',
                '一',
                '二',
                '三',
                '四',
                '五',
                '六',
                '日',
                '假日时段',
                '门1',
                '门2',
                '开门密码',
                '授权状态'
              ]
              let filterValArr = [
                'userName',
                'departmentName',
                'cardNumber',
                'terminalCode',
                'startTime',
                'endTime',
                'backLock',
                'monday',
                'tuesday',
                'wednesday',
                'thursday',
                'friday',
                'saturday',
                'sunday',
                'mondayTimeStageIndex',
                'tuesdayTimeStageIndex',
                'wednesdayTimeStageIndex',
                'thursdayTimeStageIndex',
                'fridayTimeStageIndex',
                'saturdayTimeStageIndex',
                'sundayTimeStageIndex',
                'holidayTimeStageIndex',
                'door1',
                'door2',
                'doorPassword',
                'updateFlag'
              ]
              const {
                export_json_to_excel
              } = require('../../excel/Export2Excel')
              const filterVal = filterValArr
              const list = detailslist
              const data = this.formatJson(filterVal, list)
              export_json_to_excel({
                multiHeader,
                header: tHeader,
                data,
                merges,
                filename: this.filename + this.getimeto(),
                tableheader: '2'
              })
            })
          } else {
            this.$message.error(data.errorMessage)
          }
        })
      } else if (this.activeName == 'thirdtwo') {
        // console.log(1)
        this.filename = '门禁-四门授权信息'
        if (this.fourrecordCount == 0) {
          this.$message({
            message: '无数据可导出',
            type: 'warning'
          })
          return false
        }
        this.$http({
          url: this.$http.adornUrl(
            '/terminal/entrance/entrance-name-four-door-search-page'
          ),
          method: 'post',
          data: this.$http.adornData({
            messageContent: {
              asc: true,
              pageNum: 1,
              pageSize: this.fourrecordCount,
              searchInfo: searchInfo
            },
            messageType: 0
          })
        }).then(({ data }) => {
          if (data.messageCode == 200) {
            // 四门导出
            let fourDoorList = data.messageContent.data

            fourDoorList.map(item => {
              item.updateFlag = this.updateFlagTypeFunction(item.updateFlag)
              item.door1 = item.door1 ? 1 : 0
              item.door2 = item.door2 ? 1 : 0
              item.door3 = item.door3 ? 1 : 0
              item.door4 = item.door4 ? 1 : 0
            })
            require.ensure([], () => {
              let multiHeader = [
                [
                  '姓名',
                  '部门',
                  '卡号',
                  '设备编号',
                  '星期',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '',
                  '门1',
                  '',
                  '门2',
                  '',
                  '门3',
                  '',
                  '门4',
                  '',
                  '授权状态'
                ]
              ]
              let merges = [
                'A1:A2',
                'B1:B2',
                'C1:C2',
                'D1:D2',
                'E1:K1',
                'L1:M1',
                'N1:O1',
                'P1:Q1',
                'R1:S1',
                'T1:T2'
              ]
              let tHeader = [
                '姓名',
                '部门',
                '卡号',
                '设备编号',
                '一',
                '二',
                '三',
                '四',
                '五',
                '六',
                '日',
                '是否启用',
                '时段',
                '是否启用',
                '时段',
                '是否启用',
                '时段',
                '是否启用',
                '时段',
                '授权状态'
              ]
              let filterValArr = [
                'userName',
                'departmentName',
                'cardNumber',
                'terminalCode',
                'monday',
                'tuesday',
                'wednesday',
                'thursday',
                'friday',
                'saturday',
                'sunday',
                'door1',
                'door1TimeStageIndex',
                'door2',
                'door2TimeStageIndex',
                'door3',
                'door3TimeStageIndex',
                'door4',
                'door4TimeStageIndex',
                'updateFlag'
              ]
              console.log(multiHeader[0].length)
              console.log(tHeader.length)
              const {
                export_json_to_excel
              } = require('../../excel/Export2Excel')
              const filterVal = filterValArr
              const list = fourDoorList
              const data = this.formatJson(filterVal, list)
              export_json_to_excel({
                multiHeader,
                header: tHeader,
                data,
                merges,
                filename: this.filename + this.getimeto(),
                tableheader: '2'
              })
            })
          } else {
            this.$message.error(data.errorMessage)
          }
        })
      }
    },
    // 选中数据
    handleSelectionChange(val) {
      console.log(val)
      this.chageList = val
    },
    // 删除选中数据，取消授权
    onDelete() {
      let namelistGuid = []
      if (this.activeName == 'thirdone') {
        // 获取选中数据
        this.equipmentChange()
        this.towDoorChangeList.map(item => {
          namelistGuid.push(item.namelistGuid)
        })
      } else if (this.activeName == 'thirdtwo') {
        // 获取选中数据
        this.fourChange()
        this.fourDoorChangeList.map(item => {
          namelistGuid.push(item.namelistGuid)
        })
      }
      this.$http({
        url: this.$http.adornUrl('/terminal/doorLock/empower-name-delete'),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            namelistGuid: namelistGuid,
            unitGuid: this.changeschoolid,
            userGuid: this.userGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        console.log(data)
        if (data.messageCode == 200) {
          this.$message({
            message: '删除成功',
            type: 'success'
          })
          this.onSubmit()
        } else {
          this.$message.error(data.errorMessage)
        }
      })
      console.log(namelistGuid)
    },
    // 重新下发选中数据，取消授权
    reissue() {
      let namelistGuid = []
      if (this.activeName == 'thirdone') {
        // 获取选中数据
        this.equipmentChange()
        this.towDoorChangeList.map(item => {
          namelistGuid.push(item.namelistGuid)
        })
      } else if (this.activeName == 'thirdtwo') {
        // 获取选中数据
        this.fourChange()
        this.fourDoorChangeList.map(item => {
          namelistGuid.push(item.namelistGuid)
        })
      }
      // 批量加载条
      this.loadingZ = this.Loading.service({
        lock: true,
        text: '正在修改授权中,请稍等...',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      this.$http({
        url: this.$http.adornUrl(
          '/terminal/entrance/entrance-name-resend-batch'
        ),
        method: 'post',
        data: this.$http.adornData({
          messageContent: {
            namelistGuid: namelistGuid,
            unitGuid: this.changeschoolid,
            userGuid: this.userGuid
          },
          messageType: 0
        })
      }).then(({ data }) => {
        this.loadingZ.close()
        if (data.messageCode == 200) {
          this.$message({
            message: '下发成功',
            type: 'success'
          })
          this.onSubmit()
        } else {
          this.$message.error(data.errorMessage)
        }
      })
      console.log(namelistGuid)
    }
  }
}
</script>

<style lang="scss" scoped>
.door {
  padding: 10px;
  padding-bottom: 0px;
  .el-form.el-form--inline {
  }
  //滚动条的宽度
  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
  }

  //滚动条的滑块
  ::-webkit-scrollbar-thumb {
    background-color: #a1a3a9;
    border-radius: 3px;
  }
  .demo-form-inline1 .el-form-item--mini.el-form-item {
    margin-bottom: 5px;
  }
  .el-form-item--mini.el-form-item,
  .el-form-item--small.el-form-item {
    margin-bottom: 1px;
  }
}
.page {
  display: flex;
  justify-content: center;
  align-items: center;
}

.TimeWeek {
  padding: 20px 0 0;
}
.el-dialog--center .el-dialog__body {
  padding: 0 50px;
}
// 隐藏纵向滚动条
</style>